

let li = document.querySelectorAll('li')
let content = document.querySelectorAll('.content')
let num = 0
for (let i=0;i<li.length;i++) {
  li[i].onclick = function(){
    li[num].classList.remove('active')
    content[num].classList.remove('active')
    li[i].classList.add('active')
    content[i].classList.add('active')
    num = i
  }
}

// 用户列表界面
function del(x){
  let id = $(x).parent().parent().find('.id').html()
  $.ajax({
    url: '/tourist/del',
    type: 'post',
    data: {id},
    success: function(data){
        layer.msg(data.msg);
        setTimeout(function(){
          getData()

        },1000)
    }, 
    error: function(err){
        console.log(err)
    }
})
}

$('#user-form').submit(function(e){
  e.preventDefault()
  if ($('#search').val()) {
    $.ajax({
      url: '/tourist/search',
      type: 'get',
      data: $('#user-form').serialize(),
      success: function(data){
        layer.msg(data.msg);
        resetData()
        if (data.code) {
          writeData(data)
        }
      },
      error: function(err){
          console.log(err)
      }
    })
  }else{
    getData()
  }
})

// 
$(document).ready(function(){
  
  getData()
  getTypeData()
  getScenicSpot()
  getTour()
  getOrder()
  getRoute()
  getCommentData()
})

function resetData(){
  $('#user-table').html( `<tbody><tr>
          <th>序号</th>
          <th>用户名</th>
          <th>密码</th>
          <th>注册时间</th>
          <th>操作</th>
        </tr></tbody>`)
}

function getData(){
  $.ajax({
    url: '/tourist/list',
    type: 'get',
    success: function(data){

        if (data.code) {
          resetData()
          writeData(data)
          
        }
    },
    error: function(err){
        console.log(err)
    }
})
}

function writeData(data){
  for (var i=0;i<data.data.length;i++) {
    $(`<tr>
      <td class='id'>${data.data[i]._id}</td>
      <td>${data.data[i].username}</td>
      <td>*****</td>
      <td>${data.data[i].createTime}</td>
      <td>
        <button onclick="del(this)" class="btn btn-danger btn-xs"><span class="glyphicon glyphicon-trash"></span> 删除 </button>
    </td>
    </tr>`).appendTo($('#user-table'))
  }
}





// 分类



function getTypeData(){
  $.ajax({
    url: '/type/list',
    type: 'get',
    success: function(data){

        if (data.code) {
          resetTypeData()
          writeTypeData(data)
          
        }
    },
    error: function(err){
        console.log(err)
    }
})
}

function resetTypeData(){
  $('#type-table').html( `<tbody><tr>
          <th>分类id</th>
          <th>分类</th>
          <th>注册时间</th>
          <th>操作</th>
        </tr></tbody>`)
}

function writeTypeData(data){
  for (var i=0;i<data.data.length;i++) {
    $(`<tr>
      <td class='id'>${data.data[i]._id}</td>
      <td>${data.data[i].typename}</td>
      <td>${data.data[i].createTime}</td>
      <td>
        <button onclick="changeType(this)" class="btn btn-warning btn-xs"><span class="glyphicon glyphicon-pencil"></span> 修改 </button>
        <button onclick="delType(this)" class="btn btn-danger btn-xs"><span class="glyphicon glyphicon-trash"></span> 删除 </button>
    </td>
    </tr>`).appendTo($('#type-table'))

    $(`<label style="margin-right:10px;">
        <input class="ipt-checkbox" type="checkbox" value='${data.data[i].typename}'> <span>${data.data[i].typename}</span>
      </label>`).appendTo($('.checkbox'))

  }

  

}

$('.add-type').click(function(){
  $('.add').show(600)
})
$('.add>span').click(function(){
  $('.add').hide(600)
})
$('.type .add-type-sure').click(function(){
  
  if($('.type .add input').val() == ''){
    layer.msg('请输入分类');
    return
  }else{
    $.ajax({
      url: '/type/add',
      type: 'post',
      data: {type: $('.type .add input').val()},
      success: function(data){
        layer.msg(data.msg);
        getTypeData()
      },
      error: function(err){
          console.log(err)
      }
    })
  }
})

var globalObj = ''
function changeType(obj){
  $('.change').show(600)
  globalObj = obj
}

$('.change-type-sure').click(function(){
   let id = $(globalObj).parent().parent().find('.id').html()
   console.log(globalObj)
   $.ajax({
    url: '/type/change',
    type: 'get',
    data: {typename: $('.type .change input').val(),id: id},
    success: function(data){
      layer.msg(data.msg);
      getTypeData()
      $('.change').hide(600)
    },
    error: function(err){
        console.log(err)
    }
  })
})

$('.change>span').click(function(){
  $('.change').hide(600)
})


$('#type-form').submit(function(e){
  e.preventDefault()
  if ($('#type-search').val()) {
    $.ajax({
      url: '/type/search',
      type: 'get',
      data: $('#type-form').serialize(),
      success: function(data){
        layer.msg(data.msg);
        resetTypeData()
        if (data.code) {
          writeTypeData(data)
        }
      },
      error: function(err){
          console.log(err)
      }
    })
  }else{
    getTypeData()
  }
})

function delType(x){
  let id = $(x).parent().parent().find('.id').html()
  $.ajax({
    url: '/type/del',
    type: 'post',
    data: {id},
    success: function(data){
        layer.msg(data.msg);
        setTimeout(function(){
          getTypeData()

        },1000)
    }, 
    error: function(err){
        console.log(err)
    }
})
}

let imgSrc = []





// 景区
$('.add-scenicSpot').click(function(){
  $('.scenicSpot .add').show(600)
  $('.img').html('')
  imgSrc = []
})

$('#file').change(function(e){
  $('#img').submit()
  e.preventDefault()
  setTimeout(function(){
    $.ajax({
      url: '/img/list',
      type: 'get',
      success: function(data){
        imgSrc.push(data.data)
          $( `<div class="col-sm-1">
              <img width="100%" src="${data.data}">
          </div>`).appendTo($('.img'))
      }, 
      error: function(err){
          console.log(err)
      }
  })
  },600)
})


$('.addScenicSpot').submit(function(e){
  e.preventDefault()
  var x = document.querySelectorAll('.ipt-checkbox:checked')
  var typeArr = []
  for (var i=0;i<x.length;i++) {
    typeArr.push($(x[i]).parent().find('span').html())
  }
  var data = $('.addScenicSpot').serialize()+'&typeArr=' + JSON.stringify(typeArr)
  $.ajax({
    url: '/scenicSpot/add',
    type: 'post',
    data: data,
    success: function(data){
      layer.msg(data.msg);
      setTimeout(function(){
        location.reload()
      },600)
    }, 
    error: function(err){
        console.log(err)
    }
})
})

$('#scenicSpot-table .add>span').click(function(){
  $('.scenicSpot .add').hide(600)
})


// 获取景区列表

function getScenicSpot(){
  $.ajax({
    url: '/scenicSpot/list',
    type: 'get',
    success: function(data){

        if (data.code) {
          resetScenicSpot()
          writeScenicSpot(data)
          
        }
    },
    error: function(err){
        console.log(err)
    }
})
}

function resetScenicSpot(){
  $('#scenicSpot-table').html( `<tbody><tr>
  <th>景区id</th>
  <th>景区名称</th>
  <th>景区分类</th>
  <th>景区描述</th>
  <th>景区门票价格</th>
  <th>景区图片</th>
  <th>景区开放时间</th>
  <th>注册时间</th>
  <th>操作</th>
</tr></tbody>`)
}


function writeScenicSpot(data){
  console.log(data)
  for (var i=0;i<data.data.length;i++) {
    var tr = document.createElement('tr')
    $(tr).html(` <td class='id'>${data.data[i]._id}</td>
     <td>${data.data[i].scenicSpotName}</td>`)
     data.data[i].typeArr = JSON.parse(data.data[i].typeArr)
     var td = document.createElement('td')
     for(var x=0;x<data.data[i].typeArr.length;x++){
       td.innerHTML += data.data[i].typeArr[x] + ' '
      }
      tr.appendChild(td)
      var desc = document.createElement('td')
      desc.innerHTML = data.data[i].scenicSpotDesc
      tr.appendChild(desc)
      var price = document.createElement('td')
      price.innerHTML = data.data[i].scenicSpotPrice
      tr.appendChild(price)
      var imgs = document.createElement('td')
      if(data.data[i].imgSrc.length>=0){
      $(imgs).html(`<img width='100px' src='${data.data[i].imgSrc[0]}'/>`)}
      tr.appendChild(imgs)
      var times = document.createElement('td')
      $(times).html(`${data.data[i].startTime} -  ${data.data[i].endTime}`)
      tr.appendChild(times)
      var ct = document.createElement('td')
      $(ct).html(`${data.data[i].createTime}`)
      tr.appendChild(ct)
      var bt = document.createElement('td')
      $(bt).html(`<button onclick="changeScenicSpot(this)" class="btn btn-warning btn-xs"><span class="glyphicon glyphicon-pencil"></span> 修改 </button>
          <button onclick="delScenicSpot(this)" class="btn btn-danger btn-xs"><span class="glyphicon glyphicon-trash"></span> 删除 </button>`)
      tr.appendChild(bt)
      scenicSpot = document.querySelector('#scenicSpot-table tbody')
      scenicSpot.appendChild(tr)
  }
}


$('#scenicSpot-form').submit(function(e){
  e.preventDefault()
  if ($('#scenicSpot-search').val()) {
    $.ajax({
      url: '/scenicSpot/search',
      type: 'get',
      data: $('#scenicSpot-form').serialize(),
      success: function(data){
        layer.msg(data.msg);
        resetScenicSpot()
        if (data.code) {
          writeScenicSpot(data)
        }
      },
      error: function(err){
          console.log(err)
      }
    })
  }else{
    getScenicSpot()
  }
})

var changeId = ''
function delScenicSpot(x){
  let id = $(x).parent().parent().find('.id').html()
  console.log()
  $.ajax({
    url: '/scenicSpot/del',
    type: 'post',
    data: {id},
    success: function(data){
        layer.msg(data.msg);
        setTimeout(function(){
          getScenicSpot()

        },1000)
    }, 
    error: function(err){
        console.log(err)
    }
})
}


function changeScenicSpot(x){
  $('.scenicSpot .change').show(600)
  let id = $(x).parent().parent().find('.id').html()
  changeId = id
  $.ajax({
    url: '/scenicSpot/getChange',
    type: 'get',
    data: {id},
    success: function(data){
      $('.scenicSpotName').val(data.data[0].scenicSpotName)
      let typeArr = JSON.parse(data.data[0].typeArr)
      var l = $('.change .ipt-checkbox').length
      for (var i=0;i<l;i++) {
        for (var j=0;j<typeArr.length;j++) {
          if(($('.change .ipt-checkbox')[i].value) == typeArr[j]){
            $('.change .ipt-checkbox')[i].checked = true
          }
        }
        
        // if($('.change .ipt-checkbox').val)
      }
      if (data.data[0].scenicSpotPrice) {
        $('.scenicSpotPrice').val(data.data[0].scenicSpotPrice)
      }
      if (data.data[0].startTime) {
        $('.start').val(data.data[0].startTime)
      }
      if (data.data[0].endTime) {
        $('.end').val(data.data[0].endTime)
      }
      
      if (data.data[0].imgSrc) {
        $('.scenicSpoimgSrc').val(data.data[0].imgSrc[0])
      }
      if (data.data[0].scenicSpotDesc) {
        $('.scenicSpotDesc').val(data.data[0].scenicSpotDesc)
      }
    }, 
    error: function(err){
        console.log(err)
    }
  })


}


$('.changeScenicSpot').submit(function(e){

  e.preventDefault()
  var typeArr = []
  var x = document.querySelectorAll('.change .ipt-checkbox:checked')
  for (var i=0;i<x.length;i++) {
    typeArr.push($(x[i]).parent().find('span').html())
  }
  var data = $('.changeScenicSpot').serialize()+'&imgSrc='+JSON.stringify(imgSrc)+'&typeArr=' + JSON.stringify(typeArr) + '&id=' + changeId
  $.ajax({
    url: '/scenicSpot/change',
    type: 'post',
    data: data,
    success: function(data){
      layer.msg(data.msg);
      setTimeout(function(){
        location.reload()
      },600)
    }, 
    error: function(err){
        console.log(err)
    }
})
})

let TourId = ''






// 旅行团
$('.add-Tour').click(function(){
  $('.add-tour-box').show(600)
})

$('.add-tour-box span').click(function(){
  $('.add-tour-box').hide(600)
})


$('.changeTour').submit(function(e){
  e.preventDefault()
  $.ajax({
    url: '/tour/change',
    type: 'post',
    data: $('.changeTour').serialize() + '&id=' + TourId,
    success: function(data){
      layer.msg(data.msg);
      $('.tour .change').hide(600)
      getTour()
    }, 
    error: function(err){
        console.log(err)
    }
})

})


$('#Tour-form').submit(function(e){
  e.preventDefault()
  if ($('#Tour-search').val()) {
    
    $.ajax({
      url: '/tour/search',
      type: 'get',
      data: $('#Tour-form').serialize(),
      success: function(data){
        layer.msg(data.msg);
        resetTour()
        if (data.code) {
          writeTour(data)
        }
      },
      error: function(err){
          console.log(err)
      }
    })
  }else{
    getTour()
  }
})

function getTour(){
  $.ajax({
    url: '/tour/list',
    type: 'get',
    success: function(data){
        if (data.code) {
          resetTour()
          writeTour(data)
          
        }
    },
    error: function(err){
        console.log(err)
    }
})
}


function writeTour(data){
  for (var i=0;i<data.data.length;i++) {
    $(`<tr>
      <td class='id'>${data.data[i]._id}</td>
      <td>${data.data[i].tourName}</td>
      <td>${data.data[i].tourHead}</td>
      <td>${data.data[i].tourContact}</td>
      <td>${data.data[i].tourAddress}</td>
      <td>${data.data[i].createTime}</td>
      <td>
        <button onclick="changeTour(this)" class="btn btn-warning btn-xs"><span class="glyphicon glyphicon-pencil"></span> 修改 </button>

        <button onclick="delTour(this)" class="btn btn-danger btn-xs"><span class="glyphicon glyphicon-trash"></span> 删除 </button>

    </td>
    </tr>`).appendTo($('#Tour-table'))
  }
}
function resetTour(){
  $('#Tour-table').html( `<tbody><tr>
  <th>旅行团id</th>
  <th>旅行团名称</th>
  <th>负责人</th>
  <th>联系方式</th>
  <th>注册地址</th>
  <th>注册时间</th>
  <th>操作</th>
</tr></tbody>`)
}

function changeTour(x){
  $('.tour .change').show(600)
  let id = $(x).parent().parent().find('.id').html()
  TourId = id
  $.ajax({
    url: '/tour/getChange',
    type: 'get',
    data: {id},
    success: function(data){
      $('.tourName').val(data.data[0].tourName)
      if (data.data[0].tourHead) {
        $('.tourHead').val(data.data[0].tourHead)
      }
      if (data.data[0].tourContact) {
        $('.tourContact').val(data.data[0].tourContact)
      }
      if (data.data[0].tourAddress) {
        $('.tourAddress').val(data.data[0].tourAddress)
      }
    }, 
    error: function(err){
        console.log(err)
    }
  })
}


function delTour(x){
  let id = $(x).parent().parent().find('.id').html()
  $.ajax({
    url: '/tour/del',
    type: 'post',
    data: {id},
    success: function(data){
        layer.msg(data.msg);
        setTimeout(function(){
          getTour()

        },1000)
    }, 
    error: function(err){
        console.log(err)
    }
})
}



$('.addTour').submit(function(e){
  e.preventDefault()
  $.ajax({
    url: '/tour/add',
    type: 'post',
    data: $('.addTour').serialize(),
    success: function(data){
      layer.msg(data.msg);
      $('.add-tour-box').hide(600)
      getTour()
    },
    error: function(err){
        console.log(err)
    }
  })
})


// 旅行路线
$('.add-route').click(function(){
  $('.add-route-box').show(600)
})

$('.add-route-box span').click(function(){
  $('.add-route-box').hide(600)
})

$('.addRoute').submit(function(e){
  e.preventDefault()
  $.ajax({
    url: '/route/add',
    type: 'post',
    data: $('.addRoute').serialize(),
    success: function(data){
      layer.msg(data.msg);
      $('.add-route-box').hide(600)
      getRoute()
    },
    error: function(err){
        console.log(err)
    }
  })
})

function getRoute(){
  $.ajax({
    url: '/route/list',
    type: 'get',
    success: function(data){
        if (data.code) {
          resetRoute()
          writeRoute(data)
          
        }
    },
    error: function(err){
        console.log(err)
    }
})
}

function resetRoute(){
  $('#route-table').html( `<tbody><tr>
  <th>旅行路线id</th>
  <th>旅行团名称</th>
  <th>出发地点</th>
  <th>目的地</th>
  <th>时长</th>
  <th>价格</th>
  <th>标题</th>
  <th>图片</th>
  <th>注册时间</th>
  <th>操作</th>
</tr></tbody>`)
}

function writeRoute(data){
  for (var i=0;i<data.data.length;i++) {
    $(`<tr>
      <td class='id'>${data.data[i]._id}</td>
      <td>${data.data[i].tourName}</td>
      <td>${data.data[i].startAdress}</td>
      <td>${data.data[i].endAdress}</td>
      <td>${data.data[i].time}</td>
      <td>${data.data[i].price}</td>
      <td>${data.data[i].title}</td>
      <td>
        <img width="100" src="${data.data[i].imgSrc}"/>  
      </td>
      <td>${data.data[i].createTime}</td>
      <td>
        <button onclick="changeRoute(this)" class="btn btn-warning btn-xs"><span class="glyphicon glyphicon-pencil"></span> 修改 </button>

        <button onclick="delRoute(this)" class="btn btn-danger btn-xs"><span class="glyphicon glyphicon-trash"></span> 删除 </button>

    </td>
    </tr>`).appendTo($('#route-table'))
  }
}
let routeId = ''
function changeRoute(x){
  $('.route .change').show(600)
  let id = $(x).parent().parent().find('.id').html()
  routeId = id
  $.ajax({
    url: '/route/getChange',
    type: 'get',
    data: {id},
    success: function(data){
      $('.tourRouteName').val(data.data[0].tourName)
      if (data.data[0].startAdress) {
        $('.startAdress').val(data.data[0].startAdress)
      }
      if (data.data[0].endAdress) {
        $('.endAdress').val(data.data[0].endAdress)
      }
      if (data.data[0].time) {
        $('.time').val(data.data[0].time)
      }
      if (data.data[0].price) {
        $('.price').val(data.data[0].price)
      }
      if (data.data[0].title) {
        $('.title').val(data.data[0].title)
      }
      if (data.data[0].imgSrc) {
        $('.imgSrc').val(data.data[0].imgSrc)
      }
      if (data.data[0].routeDesc) {
        $('.routeDesc').val(data.data[0].routeDesc)
      }
      
    }, 
    error: function(err){
        console.log(err)
    }
  })
}

function delRoute(x){
  let id = $(x).parent().parent().find('.id').html()
  $.ajax({
    url: '/route/del',
    type: 'post',
    data: {id},
    success: function(data){
        layer.msg(data.msg);
        setTimeout(function(){
          getRoute()

        },1000)
    }, 
    error: function(err){
        console.log(err)
    }
})
}


$('#route-form').submit(function(e){
  e.preventDefault()
  if ($('#route-search').val()) {
    
    $.ajax({
      url: '/route/search',
      type: 'get',
      data: $('#route-form').serialize(),
      success: function(data){
        layer.msg(data.msg);
        resetRoute()
        if (data.code) {
          writeRoute(data)
        }
      },
      error: function(err){
          console.log(err)
      }
    })
  }else{
    getRoute()
  }
})


// 订单
function getOrder(){
  $.ajax({
    url: '/order/list',
    type: 'get',
    success: function(data){

        if (data.code) {
          resetOrder()
          writeOrder(data)
          
        }
    },
    error: function(err){
        console.log(err)
    }
})
}

function resetOrder(){
  $('#order-table').html( `<tbody><tr>
  <th>订单id</th>
  <th>订单标题</th>
  <th>接单旅行团</th>
  <th>下单用户id</th>
  <th>创建时间</th>
  <th>价格</th>
  <th>操作</th>
</tr></tbody>`)
}

$('#order-form').submit(function(e){
  e.preventDefault()
  if ($('#order-search').val()) {
    $.ajax({
      url: '/order/search',
      type: 'get',
      data: $('#order-form').serialize(),
      success: function(data){
        layer.msg(data.msg);
        resetOrder()
        if (data.code) {
          writeOrder(data)
        }
      },
      error: function(err){
          console.log(err)
      }
    })
  }else{
    getOrder()
  }
})

function writeOrder(data){
  for (var i=0;i<data.data.length;i++) {
    if(data.data[i].tourName==undefined){
      data.data[i].tourName=""
    }
    $(`<tr>
      <td class='id'>${data.data[i]._id}</td>
      <td>${data.data[i].title}</td>
      <td>${data.data[i].tourName}</td>
      <td>${data.data[i].userID}</td>
      <td>${data.data[i].createTime}</td>
      <td>${data.data[i].price}</td>
      <td>
        <button onclick="delOrder(this)" class="btn btn-danger btn-xs"><span class="glyphicon glyphicon-trash"></span> 删除 </button>
    </td>
    </tr>`).appendTo($('#order-table'))

  }
}

function delOrder(x){
  let id = $(x).parent().parent().find('.id').html()
  $.ajax({
    url: '/order/del',
    type: 'post',
    data: {id},
    success: function(data){
        layer.msg(data.msg);
        setTimeout(function(){
          getOrder()

        },1000)
    }, 
    error: function(err){
        console.log(err)
    }
})
}




// 用户列表界面
function delComment(x){
  let id = $(x).parent().parent().find('.id').html()
  $.ajax({
    url: '/comment/del',
    type: 'post',
    data: {id},
    success: function(data){
        layer.msg(data.msg);
        setTimeout(function(){
          getCommentData()

        },1000)
    }, 
    error: function(err){
        console.log(err)
    }
})
}

$('#comment-form').submit(function(e){
  e.preventDefault()
  if ($('#commentSearch').val()) {
    $.ajax({
      url: '/comment/searchUser',
      type: 'get',
      data: $('#comment-form').serialize(),
      success: function(data){
        layer.msg(data.msg);
        resetCommentData()
        if (data.code) {
          writeCommentData(data)
        }
      },
      error: function(err){
          console.log(err)
      }
    })
  }else{
    getCommentData()
  }
})


function resetCommentData(){
  $('#comment-table').html( `<tbody><tr>
  <th>id</th>
  <th>评论用户名</th>
  <th>评论内容</th>
  <th>操作</th>
</tr></tbody>`)
}

function getCommentData(){
  $.ajax({
    url: '/comment/list',
    type: 'get',
    success: function(data){

        if (data.code) {
          resetCommentData()
          writeCommentData(data)
          
        }
    },
    error: function(err){
        console.log(err)
    }
})
}

function writeCommentData(data){
  for (var i=0;i<data.data.length;i++) {
    $(`<tr>
      <td class='id'>${data.data[i]._id}</td>
      <td>${data.data[i].userName}</td>
      <td>${data.data[i].content}</td>
      <td>
        <button onclick="delComment(this)" class="btn btn-danger btn-xs"><span class="glyphicon glyphicon-trash"></span> 删除 </button>
    </td>
    </tr>`).appendTo($('#comment-table'))
  }
}
